<script setup lang="ts">
import SonSonCom from './SonSonCom.vue';

interface Person {
  name:string
  age:number
}


// 子组件
defineProps<Person>()


// const emits = defineEmits<{
//   (e:'my-event',age:number):void
// }>()

// vue 3.3+版本新增的简洁的语法
const emits = defineEmits<{
  'my-event':[age:number]
  'getName':[name:string]
}>()
</script>

<template>
 <div class="son">
  <h2>我是子组件</h2>
  <p>{{ name }}</p>
  <p>{{ age }}</p>
  <button @click="emits('my-event',age)">点击触发事件</button>
  <button @click="emits('getName',name)">获取名字</button>
  <SonSonCom></SonSonCom>
 </div>
</template>

<style scoped>
  .son{
    border: 1px,solid red;
  }
</style>